<template>
    <div class="overviewPage">
        <PageHeader :lang="lang" ></PageHeader>
        <!--资产总览-->
        <div class="pageBody" id="pageBody">
          <!-- 左侧部分 -->
          <pageLeftMenu @showfiatmoney="iSfiatmoney" @showvirtualcurrency="iSvirtualcurrency" ref="getUnReadNotInfo"></pageLeftMenu>
          <!-- 右侧部分 -->
          <div class="pageMain">
            <div class="mainHead">
              <div class="mainTitle">
                <span class="str">{{lang['total assets replacement']}}：</span>
                <!--总资产折合-->
                <span class="total-money">
                  <font>{{totalNum(tota.TotalBTC, 4)}} BTC</font>
                  <font>≈ {{totalNum(currencyToteAssets.Amount, 2)}} {{currencyToteAssets.Code}}</font>  
                </span>
              </div>
              
              <div class="SelectAssets" @mouseover="isSelectAssets= true" @mouseout="isSelectAssets= false">
                <div class="title">{{currencyToteAssets.Code}} <img src="./images/assetsIcon2.png" :class="{active: isSelectAssets}"></div>
                <ul class="con" v-show="isSelectAssets">
                  <li v-for="item in totalAmountList" @click="selectAssets(item)">
                    {{item.Code}}
                  </li>
                </ul>
              </div>
            </div>
            <div class="assetsList">
              <ul class="Ul-itemlist">
                <li>{{lang['currency surname']}}</li>
                <li>{{lang['available']}}</li>
                <li>{{lang['freeze']}}</li>
                <li>{{lang['operate']}}</li>
              </ul>
              <ul class="itemlist"  v-for="(item, index) in list" v-if="item.AssetsType == 1">
                <li class="li-list-item">
                  <div class="img">
                    <img :src="currencyImgUrl + item.Logo"/> 
                  </div>
                  <div class="info">
                    <span class="Symbol">{{item.Symbol}}</span>
                    <span class="AssetsName">{{item.AssetsName}}</span>
                  </div>
                  <div class="icon">
                      <img v-on:mouseleave="iSheidIcon()" v-on:mouseover="iSshowIcon(item.Symbol)" src="./images/icon1.png" alt="">
                      <b v-show="showIcon === item.Symbol">1{{item.Symbol}} = 1{{item.ConvertCurrencyCode}}</b>
                  </div>
                </li>
                <li class="li-list-item">{{formatNum(item.AvailableAmount, item)}}</li>
                <li class="li-list-item">({{formatNum(item.FreeAmount, item)}})</li>

                <li class="li-list-item" style="display:none">{{item.ID}}</li>
                <li class="li-list-item">
                  <a v-show="item.AssetsType == 1" @click="openRechargePanel(item)" class="Rush_value">{{lang['recharge']}}</a>
                  <a v-show="item.AssetsType == 2" @click="openRechargeCoinPanel(index, item)" class="Rush_value">{{lang['Charging money']}}</a>
                  <a v-show="item.AssetsType == 2" @click="openWithdrawCoinPanel(index, item)" class="Rush_value Rush">{{lang['carry currency']}}</a>
                  <a class="Rush_value Rush" v-show="item.AssetsType == 1" @click="withdraw(item)">{{lang['withdraw deposit']}}</a>
                </li>
              </ul>
              <ul class="itemlist"  v-for="(item, index) in list"  v-if="item.AssetsType == 2">
                <li class="li-list-item">
                  <div class="img">
                    <img :src="currencyImgUrl + item.Logo">
                  </div>
                  <div class="info">
                    <span class="Symbol">{{item.Symbol}}</span>
                    <span class="AssetsName">{{item.AssetsName}}</span>
                  </div>
                  <div class="icon" v-if="item.Symbol === 'USDT' || item.Symbol === 'VHKD'">
                    <img  v-on:mouseleave="iSheidIcon()" v-on:mouseover="iSshowIcon(item.Symbol)" src="./images/icon1.png" alt="">
                    <!-- item.ConvertCurrencyCode -->
                    <b v-show="showIcon === item.Symbol">1{{item.Symbol}} = 1{{item.ConvertCurrencyCode}}</b>
                  </div>
                </li>
                <li class="li-list-item">{{formatNum(item.AvailableAmount, item)}}</li>
                <li class="li-list-item">({{formatNum(item.FreeAmount, item)}})</li>
                <li class="li-list-item" style="display:none">{{item.ID}}</li>
                <!-- <li class="li-list-item" v-if="item.AssetsCode === 'EOS'">
                  <a @click="openNote()" class="Rush_value disabled">{{lang['assets suspend']}}</a>
                  <a @click="openNote()" class="Rush_value disabled">{{lang['assets suspend']}}</a>
                </li> -->
                <li class="li-list-item">
                  <!-- 充值 -->
                  <a v-show="item.AssetsType == 1" @click="openRechargePanel(item)" class="Rush_value">{{lang['recharge']}}</a>
                  <!-- 开始 充币、提币 -->
                  <a v-show="item.AssetsType == 2" @click="openRechargeCoinPanel(index, item)" class="Rush_value">{{lang['Charging money']}}</a>
                  <a v-show="item.AssetsType == 2" @click="openWithdrawCoinPanel(index, item)" class="Rush_value Rush">{{lang['carry currency']}}</a>
                  <!-- 结束 充币、提币 -->
                  <!-- 提现 -->
                  <a class="Rush_value Rush" v-show="item.AssetsType == 1" @click="withdraw">{{lang['withdraw deposit']}}</a>
                </li>
              </ul>
              <div class="fiatmoneyExplain" >
                <ul>
                  <li><p>● {{lang['simultaneous changes in the equivalent value of fiat and digital currencies']}}</p></li>
                  <li v-show="fiatmoneyExplain" v-for="(item, index) in list" v-if="item.AssetsType == 1"><p>● 1 {{item.Symbol}} = 1 {{item.ConvertCurrencyCode}}</p></li>
                </ul>
              </div>
            </div>
          </div>
        </div>

        <!-- 输入美金弹框 -->
        <SwModal modalClass="userModal" :isDestroy="false" :isShow.sync="isShowRechargePanel" :isCloseOnClickBg="true">
          <div class="safety_verification w500">
            <div class="title">
              {{lang['please full']}}
              <a class="close_safety" @click="isShowRechargePanel = false">
                <img src="../../assets/images/page/asset_03.png"></a>
            </div>
            <ul>
              <li>
                <p class="inpu">
                  <input :placeholder="lang['please full amount']" maxlength="11" v-model="rechargeAmount" ref="rechargeAmount"></p>
              </li>
              <li>
                <button type="button" class="subitmBox" @click="submitRecharge">{{lang['NextStep']}}</button>
              </li>
            </ul>
          </div>
        </SwModal>

        <!-- 提币安全验证 提币第二步-->
        <SwModal  :isShow.sync="isShowAssetPassword" :isDestroy="false" :isCloseOnClickBg="true" modalClass="'userModal'">

          <div class="safety_verification" style="width:440px;padding:0 66px;">
            <div class="title" style="padding-bottom:0">{{lang['safety verification']}}
              <a @click="isShowAssetPassword = false" class="close_safety"><img src="../../assets/images/page/asset_03.png"></a>
            </div>
            <ul>
              <li>
                  <p class="text" style="text-indent:8px;padding-top:10px;">{{lang['basic_capitalPassword']}}</p>
                  <p class="inpu">
                    <input type="password" :placeholder="lang['pleaseEnterAFundPassword']" v-model="assetPassword" maxlength="20" minlength="8">
                  </p>
              </li>
              <!-- 如果已经设置谷歌验证，就需输入谷歌验证码 -->
              <li v-show="isShowGoogleVerify">
                  <p class="text">{{lang['loginCodeGoogle']}}</p>
                  <p class="inpu">
                    <input type="password" v-model="googleCode">
                  </p>
              </li>
              <li>
                <br/>
                  <button type="button" class="subitmBox" style="margin-top:1.2rem" @click="submitWithdrawCoin">{{lang['determineBth']}}</button>
                  <router-link class="routerlink" style="margin-top:2rem;display:inline-block" :to="{path:'/safety', query:{isShowForgerPin: 'true'}}" v-html="lang['forget fund password']"></router-link>
              </li>
            </ul>
          </div>
        </SwModal>

        <!-- 提币进度 提币第三步 -->
        <SwModal :isShow.sync="isWithdrawCoinProcessing" :isDestroy="false" :isCloseOnClickBg="true" modalClass="'userModal'">
          <div class="safety_verification TippyProgress">
            <div class="title">{{lang['please wait patiently']}}
              <a class="close_safety" @click="isWithdrawCoinProcessing = false"><img src="../../assets/images/page/asset_03.png"></a>
            </div>
            <div class="schedule" style="margin-top:0">
                <a class="active">{{lang['submit to']}}</a>
                <a>{{lang['handle']}}</a>
                <a>{{lang['accomplish']}}</a>
            </div>
            <!-- 判断手机绑定还是邮箱绑定，优先手机验证 -->
            <ul>
              <li><span>{{lang['currency surname']}}：</span>{{mention.CoinName}} </li>
              <li><span>{{lang['currency address']}}：</span>{{mention.CoinAddress}}
                <!-- 地址未保存保存地址 -->
                <span v-show="!mention.IsAddAddress">
                  <em>{{lang['address is not saved']}}</em>
                  <a href="javascript:;" @click="lijibaocun">{{lang['immediate preservation']}}</a>
                </span>

              </li>
              <li><span>{{lang['Number of arrivals']}}：</span>{{totalNum(mention.Fee, addCurrSource.Precision)}}</li>
              <li><span>{{lang['Application Date']}}：</span>{{mention.ApplyDate}}</li>
            </ul>
            <router-link to="/assets/records/" class="chankanjilu" style="margin-bottom:30px">{{lang['View record tracking status']}}</router-link>
          </div>
        </SwModal>

        <!-- 保存提币地址 第四部 -->
        <SwModal :isShow.sync="baocuntibi" :isDestroy="false" :isCloseOnClickBg="true" modalClass="'userModal'">
          <div class="safety_verification w600">
            <div class="title">{{lang['Add address coin']}}
              <a class="close_safety" @click="xinzendizhi"><img src="../../assets/images/page/asset_03.png"></a>
            </div>
            <!-- 判断手机绑定还是邮箱绑定，优先手机验证 -->
            <ul>
              <li>
                  <p class="text">{{lang['btc address']}}</p>
                  <p class="inpu">
                    <input type="text" name="" :value="mention.CoinAddress" maxlength="11" disabled="disabled">
                  </p>
              </li>
              <li>
                  <p class="text">{{lang['remarks']}}</p>
                  <p class="inpu">
                    <input type="text" v-model="baizhuxinxi" name="">
                  </p>
              </li>
            </ul>
              <button type="button" class="subitmBox" @click="quedintijiao">{{lang['determineBth']}}</button>
          </div>
        </SwModal>

        <!-- 重要提示 打开页面提示 充币之前的提示-->
        <SwModal :isShow.sync="aicisee" :isDestroy="false" :isCloseOnClickBg="true" modalClass="'userModalBackg userModalBorder'">
          <div class="overviewPage-important-tip">
              <h2 class="tit">{{lang['Important']}}</h2>
              <div class="wenzi" style="text-align:center">
                <img src="../fiat/images/warn.png" height="20" width="20" alt="">
                <!-- 替换单个字符串 -->
                <!-- {{lang['Packet address recharge'].replace({CurrencyName}', popout)}} -->
                <!-- 全局替换 -->
                {{lang['Packet address recharge'].replace(/\{CurrencyName\}/g, popout || '')}}
              </div>
              <button type="button" @click="icisee(item)" class="subitmBox">{{lang['determineBth']}}</button>
                <p>
                  <label>
                    <input type="checkbox" name="" v-model="item.state" v-on:change="dontremind($event)" value=""> {{lang['no more reminders']}}
                  </label>
                </p>
          </div>
        </SwModal>

         <!-- 充币公共弹框 -->
        <SwModal :isShow.sync="addCurrAlert" :isDestroy="false"  :isCloseOnClickBg="true" modalClass="'userModalBackg userModalBorder'">
            <!-- 从这里开始的所有影藏和显示都不需要控制，只需要控制遮罩 -->
            <div class="Banknote_address">
                <!-- 关闭的叉叉 -->
                <div class="asset">
                    <a @click="addCurrAlert = false"></a>
                </div>
                <!-- 标题 -->
                <h3 class="title1">
                    <span style="position:relative; top:6px; left:-5px;">
                      <img  width="24px" :src="currencyImgUrl + addCurrSource.Logo"/>
                    </span>
                    {{addCurrSource.Symbol}} {{lang['coin charging address']}}
                </h3>

                <div class="BanknoteLt">
                    <!-- 没地址是个什么玩意? -->
                    <div class="topUpAddress">
                        <span v-if="addCurrSource.AssetsTag === null" style="color: #fff;">
                            {{lang['no address']}}
                        </span>
                        <p>
                            <input :value="addCurrSource.AssetsTag" readonly="true" id="biao">
                            <a @click="duplicate" v-if="addCurrSource.AssetsTag !== null">{{lang['duplicate']}}</a>
                        </p>
                    </div>
                    <!-- 这个是干嘛的？ -->
                    <div v-if="addCurrSource.AssetsTag !== null" class="walletqrcode">
                        <img width="130px" :src="barcodeSrc">
                    </div>
                    <!-- 下面的注释 -->
                    <div class="topUpExplain">
                        <p>
                            {{lang['look over']}}
                            <router-link to="/assets/records/">{{lang['coin charge record']}}</router-link>
                            {{lang['track']}}
                        </p>
                        <p class="explain">{{lang['kindly reminder']}}</p>
                        <div>
                            <p>
                                <span>•</span>
                                <i>
                                  {{lang['kindly reminder first'].replace('{adderss}', addCurrSource.AssetsName || '')}}
                                </i>
                            </p>
                            <p>
                                <span>•</span>
                                <i>{{(lang['kindly reminder two'].replace('{MinConfirms}', addCurrSource.MinConfirms || '-')).replace('{MinOutConfirms}', addCurrSource.MinOutConfirms || '-')}}</i>
                            </p>
                            <p class="coloRed">
                                <span>•</span>
                                <i>
                                  {{lang['kindly reminder thriee'].replace('{quantity}', addCurrSource.MinQuantity || '0').replace('{symbol}', addCurrSource.Symbol || '')}}
                                </i>
                            </p>
                            <router-link v-show="addCurrSource.Symbol === 'USDT' || addCurrSource.Symbol === 'VHKD'" style="color:#2F7BC8" :to="'/assets/remitInfo?assetsCode=' + addCurrSource.ConvertCurrencyCode +'&Id='+addCurrSource.ID">{{lang['Deposit USD'].replace('{USD}', addCurrSource.ConvertCurrencyCode || '')}}</router-link>
                            <br>
                            <br>
                        </div>
                    </div>
                </div>
            </div>
        </SwModal>

         <!-- 提币公共弹框 -->
        <SwModal :isShow.sync="getCurrAlert" :isDestroy="false" :isCloseOnClickBg="true" modalClass="'userModal'">
            <div class="Banknote_address Bill_address">
                <div class="asset">
                    <a @click="getCurrAlert = false"></a>
                </div>
                <h3 class="title1">
                    <span style="position:relative; top:6px; left:-5px;">
                      <img width="24px" :src="currencyImgUrl + addCurrSource.Logo"/>
                    </span>
                    {{addCurrSource.Symbol}} {{lang['coin withdraw address']}}
                </h3>
                <div class="lis">
                    <p class="titl">{{lang['currency address']}}</p>
                    <!-- <span>{{item.ID}}</span> -->
                    <p class="inpu">
                      <!-- 提币地址 -->
                        <input type="text" @click="tibitanchukuang" @keyup="tanchukuang = false" :placeholder="lang['please enter the coin address']" name="" v-model="coinAddress">
                        <!-- 提币地址 -->
                        <a class="tishi" style="display: none">{{lang['please enter the coin address']}}</a>
                        <div v-show="tanchukuang" id="dlList">
                          <p v-for="(item, index) in currentCoinAddress" @click="tianjiadizhi(item, index)">
                            <span>{{item.Address}}</span>
                            <span>{{item.Remark}}</span>
                          </p>
                        </div>
                    </p>
                  </div>
            <!-- 提币地址 -->
            <!--输入数量-->
                <div class="lis">
                    <p class="titl">{{lang['Amount Available']}}<em>: {{totalNum(AvailableOutAmount, addCurrSource.Precision)}}</em></p>
                    <p class="inpu" @click="tanchukuang = false">
                      <!-- 输入数量 -->
                        <input type="text" ref="quantity" :placeholder="lang['please enter quantity']" v-model="quantity" @keyup="calcFee">
                        <!-- 输入数量 -->
                        <span>{{addCurrSource.AssetsCode}}</span>
                    </p>
                </div>
                <div class="lis">
                    <p class="titl">{{lang['poundage']}}</p>
                    <p class="inpu">
                        <input type="text" readonly="readonly" v-model="fee" class="bkg">
                        <span>{{addCurrSource.AssetsCode}}</span>
                    </p>
                    <label>{{lang['Fee deduction']}}</label>
                </div>
                <div class="lis">
                    <p class="titl">{{lang['Actual to Account Qty']}}</p>
                    <p class="inpu">
                        <input type="text" readonly="readonly" v-model="realQuantity" name="" class="bkg">
                        <span>{{addCurrSource.AssetsCode}}</span>
                    </p>
                </div>
                <div style="text-align: center;">
                  <router-link class="subitmBox subitmBox1111" v-show="addCurrSource.Symbol === 'USDT' || addCurrSource.Symbol === 'VHKD'" :to="'/assets/bankcard?AssetsType=' + addCurrSource.ConvertCurrencyCode">{{lang['drawFB'].replace('{name}', addCurrSource.ConvertCurrencyCode || '')}}</router-link>
                  <a @click="checkWithdrawCoin" class="subitmBox subitmBox1111"> {{lang['carry currency']}} {{addCurrSource.Symbol}} </a>
                </div>
              </div>
        </SwModal>

        <!-- EOS禁止充提弹框 -->
        <SwModal :isShow.sync="banLayer" :isShowBg="true"  modalClass="userModal smallModal" :isCloseOnClickBg="true" :isShowCloseBtn="true"
        :title="lang['withdrawals currently suspended title']" :okText="lang['determineBth']" :ok="closeBanLayer">
          <div class="banLayer">
            <p><a href="/news/announcement" v-html="lang['deposits and withdrawals currently suspended'].replace('{code}', stopCode || '')"></a></p>
          </div>
        </SwModal>
        <PageFooter2 :lang="lang" :langKey="langKey"></PageFooter2>
        </div>
    </template>
<script>
import commonMixins from '@/mixins/common.js'
import mixins from './mixins.js'
import SwModal from '@/components/SwModal'
import ModalApi from '@/components/SwModal/api.js'
import Utils from '@/utils/Utils.js'
import commonFilter from '@/filters/common.js'
import Decimal from '@/libs/decimal.min.js'
import CheckCurrencyOnInput from '@/utils/CheckCurrencyOnInput.js'
import pageLeftMenu from './components/pageLeftMenu.vue'
import { hosts } from '@/service/Http/index.js'
export default {
  mixins: [commonMixins, mixins],
  data () {
    return {
      addCurrAlert: false,      // 充币弹框显示与否
      getCurrAlert: false,      // 提币的弹框显示与否
      addCurrSource: {
        Symbol: 'USD'
      },        // 充币弹框的数据源点的哪一个就是哪一个(和提币的item一致)
      totalassets: [],
      aicisee: false,
      show_withdraw: false,
      CoinID: '',
      item: [{
        state: false
      }, {
        state: true
      }],
      tibi: [{
        state: false
      }, {
        state: true
      }],
      tankaugn: false,
      list: '',
      listSS: '',
      show: false,
      renzhen: false,
      AssetsTag: '',
      rechargeAmount: '',
      tota: {
        TotalUSD: 0,
        TotalHKD: 0
      },
      PageSizes: '',
      PageIndexs: 1,
      tanchukuang: false,
      coinAddress: '',
      Avai: '',
      isShowRechargeCoinPanel: false,
      quantity: '',
      fee: [],
      realQuantity: '',
      daozhang: '',
      assetPassword: '',
      isWithdrawCoinProcessing: false,
      isShowWithdrawCoinPanel: false,
      baocuntibi: false,
      indextest: -1,
      indext: 0,
      AvailableOutAmount: '',
      withdrawCoinConfigs: {},
      currentWithdrawCoinConfig: {},
      coinAddresses: {},
      currentCoinAddress: [],
      mention: {
        CoinName: '',
        CoinAddress: '',
        Fee: '',
        shenqingshijian: '',
        IsAddAddress: '',
        CoinID: '',
        ApplyDate: ''
      },
      baizhuxinxi: '',
      barcodeSrc: '',
      countdown: '',
      withdrawConfigs: {},
      currentWithdrawConfig: {},
      isShowRechargePanel: false,
      rechargeConfigs: {},
      currentRechargeConfig: {},
      withdrawSecurityConfig: {},
      isShowAssetPassword: false,
      isShowGoogleVerify: false,
      googleCode: '',
      addPassword: '',
      popout: '',
      coinRechargeConfigs: {},
      inputPrecision: 0,
      customer: {},
      KYCRule: {},
      fiatmoney: [],
      virtualcurrency: [],
      fiatmoneyExplain: false,
      showIcon: -1,
      assetsCode: '',
      itemSymbol: '',
      banLayer: false,
      stopCode: '',
      currentActionType: '', // 充币或提币
      isdisabledClick: true,
      totalAmountList: [],
      isSelectAssets: false,
      currencyToteAssets: {}
    }
  },
  components: {
    SwModal,
    pageLeftMenu
  },
  watch: {
    '$route.query.AssetsType' (nv, ov) {
      this.getlists()
    }
  },
  methods: {
    selectAssets (item) {
      this.isSelectAssets = false
      this.currencyToteAssets = item
      console.log(this.currencyToteAssets)
    },
    iSshowIcon (name) {
      this.showIcon = name
    },
    iSheidIcon () {
      this.showIcon = ''
    },
    formatNum (val, item) {
      let prec = item.Precision
      return commonFilter.fillDecimal(commonFilter.currency(new Decimal(val || 0).toFixed(10), 'USD', '', prec), prec)
    },
    totalNum (val, pre) {
      return commonFilter.fillDecimal(commonFilter.currency(new Decimal(val || 0).toFixed(10), 'USD', '', pre), pre)
    },
    duplicate () {
      var Url2 = document.getElementById('biao')
      Url2.select()
      document.execCommand('Copy')
      ModalApi.message(this.lang['copy success'], null, null, 'userModal')
    },
    assetCurrentBox () {
      this.isShowRechargeCoinPanel = false
    },
    countdownFn () {
      this.theTimer = setInterval(() => {
        this.countdown--
        this.lang.RegisterSend = this.countdown
        if (this.countdown < 1) {
          if (this.langKey === 'zh-CN') {
            this.lang.RegisterSend = '发送'
          } else if (this.langKey === 'en') {
            this.lang.RegisterSend = 'Send'
          }
          this.countdown = 5
          clearInterval(this.theTimer)
          this.pass.passCode = true
        }
      }, 1000)
    },
    quedintijiao () {
      this.$http.post('CoinUserAddress/Add', {
        CoinID: this.CoinID,
        Address: this.mention.CoinAddress,
        Remark: this.baizhuxinxi,
        TransactionPassword: this.assetPassword,
        ClientType: 0
      }, {
        modalOptions: {
          modalClass: 'userModal'
        }
      })
      .then((res) => {
        if (res.StatusCode === '200') {
          this.baocuntibi = false
          this.getCoinAddressById(this.CoinID)
          ModalApi.message(this.lang['add coin address successful'], null, null, 'userModal')
          // 需要更新对应的币是否存在提币地址的状态
        }
      })
      this.isShowRechargeCoinPanel = false
      this.isShowWithdrawCoinPanel = false
    },
    xinzendizhi () {
      this.baocuntibi = false
    },
    shuruquxiao () {
      this.placeholder = false
    },
    // 保存提币地址的该函数
    lijibaocun () {
      if (this.mention.IsAddAddress === false) {
        this.isWithdrawCoinProcessing = false
        this.baocuntibi = true
      }
    },
    getCoinRechargeConfig (item, index) {
      if (!this.coinRechargeConfigs[item.ID]) {
        this.$http.post('Setting/GetCoinTransactionInConfig', {
          assetsID: item.ID
        }, {
          modalOptions: {
            modalClass: 'userModal'
          }
        }).then((res) => {
          let c = res.Data || {}
          Object.assign(item, c)
          this.$set(this.list, index, item)
          this.coinRechargeConfigs[item.ID] = c
        })
      }
    },
    TippyProgress () {
      // 注释关闭弹框
      // this.isWithdrawCoinProcessing = false
      this.openWithdrawCoinPanel()
      this.getlists()
    },
    // 点击提币确定
    checkWithdrawCoin () {
      this.assetPassword = ''
      this.googleCode = ''

      if (!this.coinAddress) {
        ModalApi.message(this.lang['please enter the coin address'], null, null, 'userModal')
        return
      }

      if (!this.quantity) {
        ModalApi.message(this.lang['please enter quantity'], null, null, 'userModal')
        return
      }

      let minQuantity = this.currentWithdrawCoinConfig.MinQuantity

      if (parseFloat(this.quantity) > parseFloat(this.AvailableOutAmount)) {
        ModalApi.message(this.lang['not sufficient funds'], null, null, 'userModal')
        this.realQuantity = ''
        return
      }

      if (parseFloat(this.quantity) < parseFloat(minQuantity)) {
        ModalApi.message(this.lang['amountmoneyless than'].replace('{minCurrIcon}', ' ' + minQuantity + ' ' + this.addCurrSource.Symbol), null, null, 'userModal') // this.lang['not sufficient funds']
        this.realQuantity = ''
        return
      }

      // 验证通过关闭提币弹框
      this.getCurrAlert = false
      this.$http.post('Security/GetSecurityStrategy', {}, {
        modalOptions: {
          modalClass: 'userModal'
        }
      })
      .then((res) => {
        this.withdrawSecurityConfig = res.Data
        if (res.CashOutVerifyType === 300) { // 需要输入资金密码
          this.isShowAssetPassword = true
        }
        if (res.CashOutVerifyType === 301) { // 需要资金密码+google验证
          this.isShowAssetPassword = true
          this.isShowGoogleVerify = true
        }
      })
    },
    // 提币密码验证
    submitWithdrawCoin () {
      if (!this.assetPassword) {
        ModalApi.message(this.lang['pleaseEnterAFundPassword'], null, null, 'userModal')
        return
      }
      if (this.isShowGoogleVerify && !this.googleCode) {
        ModalApi.message(this.lang['43009'], null, null, 'userModal')
        return
      }
      if (!this.isdisabledClick) { return }
      this.isdisabledClick = false

      this.$http.post('CustomerAssets/ApplyTransactionOut', {
        CoinID: this.CoinID,
        CoinAddress: this.coinAddress,
        ApplyQuantity: this.quantity,
        TradePassword: this.assetPassword,
        GoogleCode: this.googleCode
      }, {
        ignorableCodes: '51022',
        modalOptions: {
          modalClass: 'userModal'
        }
      })
      .then((res) => {
        if (res.StatusCode === '200') {
          // 提币成功后，刷新当前list
          this.getlists()
          // 提币第二个弹框弹出提币成功信息
          this.mention.CoinName = res.Data.CoinName
          this.mention.CoinAddress = res.Data.CoinAddress
          this.mention.Fee = res.Data.NeedPayQuantity
          this.mention.IsAddAddress = res.Data.IsAddAddress
          this.mention.CoinID = res.Data.CoinID
          this.mention.ApplyDate = res.Data.ApplyDate
          this.isShowAssetPassword = false
          this.isShowGoogleVerify = false
          this.isWithdrawCoinProcessing = true
          this.$refs.getUnReadNotInfo.$emit('getUnReadNotInfo') // 调用财务记录最新显示
        } else if (res.StatusCode === '51025') { // 资金密码错误
          ModalApi.message(this.lang['51025'], null, null, 'userModal')
        } else if (res.StatusCode === '43010') { // 谷歌验证码错误
          ModalApi.message(this.lang['43010'], null, null, 'userModal')
        } else if (res.StatusCode === '51022') {
          ModalApi.message((this.lang['amountmoneyless than'].replace('{minCurrIcon}', ' ' + this.currentWithdrawCoinConfig.MinQuantity) + ' ' + this.addCurrSource.Symbol), null, null, 'userModal')
        } else {
          // ModalApi.message(this.lang[res.StatusCode], null, null, 'userModal')
        }
        this.isdisabledClick = true
      })
    },
    tianjiadizhi (item, index) {
      this.coinAddress = item.Address
      this.tanchukuang = false
    },
    tibitanchukuang () {
      if (this.currentCoinAddress.length > 0) {
        this.tanchukuang = true
      }
    },
    closeBanLayer () {
      this.banLayer = false
    },
    close () {
      this.show = false
    },
    openRechargePanel (item) {
      this.assetsCode = item.Symbol
      this.currentRechargeItem = item
      this.rechargeAmount = ''
      // 0：未认证，1:未通过,3：已提交认证资料，2：认证通过
      this.$http.post('Security/GetCustomer', {
      }, {
        // mock: 'GetAssetsRecordDetail'
        modalOptions: {
          modalClass: 'userModal'
        }
      })
      .then((res) => {
        if (res.VerifyResult === 0 || res.VerifyResult === 1) {
          let tip = res.VerifyResult === 0 ? this.lang['you have not completed authentication'] : this.lang['certification not pass']
          let confirm = ModalApi.confirm({
            isShowCloseBtn: true,
            isCloseOnClickBg: true,
            modalClass: 'commonModal smallModal userModal',
            title: 'point out',
            content: tip,
            okText: 'to authenticate',
            noText: '',
            isShowBg: true,
            ok: () => {
              confirm.close()
              this.$nextTick(() => {
                this.$router.push({path: '/safety?isToggleCaidVerified=true'})
              })
            }
          })
        }
        if (res.VerifyResult === 3) {
          ModalApi.message(this.lang['Authentication information audit patiently'], null, null, 'userModal')
        }

        if (res.VerifyResult === 2) {
          this.isShowRechargePanel = true
        }
      })
    },
    // 提现判断
    withdraw (item) {
      this.itemSymbol = item.Symbol
      let KYCRule = 3
      this.getKYCRule(KYCRule).then((res) => {
        this.KYCRule = res.Data || []
        // 判断是否需要认证
        if ((this.KYCRule.IsEnaled) && this.customer.VerifyResult !== 2) {
          let content
          let okText = 'to authenticate'
          if (this.customer.VerifyResult === 0) {
            content = 'you have not completed authentication'  // '您还没有实名认证，不能交易',
          }
          if (this.customer.VerifyResult === 1) {
            content = 'c2C your real name certification failed' // "您的实名认证未通过，请重新认证"
          }
          if (this.customer.VerifyResult === 3) { // 您的实名认证正在审核中，请耐心等待'
            content = '42075'
            okText = 'determineBth'
          }

          let handle = ModalApi.confirm({
            isShowCloseBtn: true,
            isCloseOnClickBg: true,
            modalClass: 'commonModal smallModal userModal',
            title: 'prompt message',
            content: content,
            noText: '', // '取消',
            okText: okText, // '去认证',
            isShowBg: true,
            ok: () => {
              // 审核中不需要跳去认证
              this.customer.VerifyResult !== 3 && this.$router.push({path: '/safety?isToggleCaidVerified=true'})
              handle.close()
            }
          })
          return
        }
        this.$nextTick(() => {
          this.$router.push({path: '/assets/bankcard?AssetsType=' + this.itemSymbol})
        })
      })
    },
    getRechargeConfig () {
      let promise = Utils.makePromise()
      if (this.rechargeConfigs[this.currentRechargeItem.ID]) {
        this.currentRechargeConfig = this.rechargeConfigs[this.currentRechargeItem.ID]
        promise.resolveHandle()
      } else {
        this.$http.post('Setting/GetRechargeConfig', {
          assetsID: this.currentRechargeItem.ID
        }, {
          modalOptions: {
            modalClass: 'userModal'
          }
        }).then((res) => {
          this.currentRechargeConfig = res.Data
          this.rechargeConfigs[this.currentRechargeItem.ID] = this.currentRechargeConfig
          promise.resolveHandle()
        })
      }
      return promise
    },
    submitRecharge () {
      if (!this.rechargeAmount) {
        ModalApi.message(this.lang['please enter the amount'], null, null, 'userModal')
        return
      }

      this.getRechargeConfig()
      .then(() => {
        let minRecharge = this.currentRechargeConfig.MinRecharge
        if (this.rechargeAmount < minRecharge) {
          ModalApi.message(this.lang['51029'].replace('{amount}', minRecharge || []).replace('{nation}', this.assetsCode || []), null, null, 'userModal')
          return
        }

        this.$http.post('CustomerAssets/CustomerRecharge', {
          amount: parseFloat(this.rechargeAmount),
          assetsCode: this.assetsCode // amount: this.rechargeAmount
        })
        .then((res) => {
          if (res.StatusCode === '200') {
            this.isShowRechargePanel = false
            this.$nextTick(() => {
              this.$router.push({path: '/assets/remitInfo?assetsCode=' + this.assetsCode + '&Id=' + this.currentRechargeItem.ID})
            })
          }
        })
      })
    },
    // 点击充币的函数弹出提示框
    openRechargeCoinPanel (index, item) {
      // 1.避免错误，先获取数据源再说
      this.addCurrSource = item
      // 当前要禁止充提的币名
      this.stopCode = item.AssetsCode
      // 弹出层是否显示
      this.banLayer = item.IsEnableRecharge === true ? false : true
      if (this.banLayer) return
      // 2.给所需数据赋值
      this.getCoinRechargeConfig(item, index)
      this.popout = item.AssetsName
      this.isShowWithdrawCoinPanel = false
      this.barcodeSrc = `${location.protocol + hosts.host1}/api/Barcode/GetBarcode?content=${item.AssetsTag}`
      this.indext = index
      this.Avai = item.AvailableOutAmount

      // 如果该币没有禁止提币则继续后续操作
      if (item.IsEnableRecharge) {
        // 3.再检查是否需要弹出重要提示
        if (localStorage.getItem('AssetsTopupHint') === 'false' || localStorage.getItem('AssetsTopupHint') === null) {
          this.aicisee = true
        } else {
          this.addCurrAlert = true
        }
      }
    },
    // 点击提币的函数--弹出提示框
    openWithdrawCoinPanel (index, item) {
      // 当前要禁止提币的币名
      this.stopCode = item.AssetsCode
      // 弹出层是否显示
      this.banLayer = item.IsEnableWithdraw === true ? false : true
      if (this.banLayer) return
      // 如果该币没有禁止提币则继续后续操作
      if (item.IsEnableWithdraw) {
        let KYCRule = 4
        this.getKYCRule(KYCRule).then((res) => {
          this.KYCRule = res.Data || []
          // 判断是否需要认证
          if (this.KYCRule.IsEnaled && this.customer.VerifyResult !== 2) {
            let content
            let okText = 'to authenticate'
            if (this.customer.VerifyResult === 0) {
              content = 'you have not completed authentication'  // '您还没有实名认证，不能交易',
            }
            if (this.customer.VerifyResult === 1) {
              content = 'c2C your real name certification failed' // "您的实名认证未通过，请重新认证"
            }
            if (this.customer.VerifyResult === 3) { // 您的实名认证正在审核中，请耐心等待'
              content = '42075'
              okText = 'determineBth'
            }

            let handle = ModalApi.confirm({
              isShowCloseBtn: true,
              isCloseOnClickBg: true,
              modalClass: 'commonModal smallModal userModal',
              title: 'prompt message',
              content: content,
              noText: '', // '取消',
              okText: okText, // '去认证',
              isShowBg: true,
              ok: () => {
                // 审核中不需要跳去认证
                this.customer.VerifyResult !== 3 && this.$router.push({path: '/safety?isToggleCaidVerified=true'})
                handle.close()
              }
            })
            return
          }

          // 清空input输入框
          this.resetFee()
          // 获取数据源
          this.addCurrSource = item
          // 显示弹框
          this.getCurrAlert = true

          this.getWithdrawConfigById(item.ID)
          .then(() => {
            this.indextest = index
            this.AvailableOutAmount = item.AvailableOutAmount
            this.CoinID = item.ID
            // ApiCustomerAssetsApplyTransactionOutPost 申请提币地址 100 x 0.1 = 10 >=0.5 || 4 x 0.1 = 0.4 >=  4-0.5=3.5
            this.getCoinAddressById(item.ID)
          })
        })
      }
    },
    getWithdrawConfigById (id) {
      let promise = Utils.makePromise()
      if (!this.withdrawCoinConfigs[id]) {
        this.$http.post('Setting/GetCoinTransactionOutConfig', {
          assetsID: id
        }, {
          modalOptions: {
            modalClass: 'userModal'
          }
        }).then((res) => {
          this.withdrawCoinConfigs[id] = res.Data || {}
          this.inputPrecision = this.withdrawCoinConfigs[id].Precision
          /*
          {
            MinQuantity: 500,
            FeeRate: 0.01,
            MinFee: 1,
            FixFee: 6,
            FeeType: 2 // 1固定 2比例
          }
          */
          this.currentWithdrawCoinConfig = this.withdrawCoinConfigs[id]
          promise.resolveHandle()
        })
      } else {
        this.currentWithdrawCoinConfig = this.withdrawCoinConfigs[id]
        promise.resolveHandle()
      }
      return promise
    },
    getCoinAddressById (id) {
      let promise = Utils.makePromise()
      if (!this.coinAddresses[id]) {
        this.$http.post('CoinUserAddress/GetCoinUserAddress', {
          CoinID: id,
          Remark: '',
          CoinAddress: '',
          PageSize: this.PageSizes,
          PageIndex: this.PageIndexs,
          ClientType: 0
        }, {
          modalOptions: {
            modalClass: 'userModal'
          }
        }).then((res) => {
          this.coinAddresses[id] = res.Data
          this.currentCoinAddress = this.coinAddresses[id]
          promise.resolveHandle()
        })
      } else {
        this.currentCoinAddress = this.coinAddresses[id]
        promise.resolveHandle()
      }
      return promise
    },
    resetFee () {
      this.quantity = ''
      this.coinAddress = ''
      this.fee = ''
      this.realQuantity = ''
    },
    // 计算手续费和实际到账数量的函数
    calcFee () {
      if (this.quantity) {
        let fixFee = 0
        if (this.currentWithdrawCoinConfig.FeeType === 1) {
          fixFee = this.currentWithdrawCoinConfig.FixFee // 固定
        } else {
          fixFee = this.currentWithdrawCoinConfig.FeeRate * this.quantity // 按比例
        }
        // 最小费率
        let minFee = this.currentWithdrawCoinConfig.MinFee
        // 最小限制提币数量
        let minQuantity = this.currentWithdrawCoinConfig.MinQuantity
        // 可用数量
        let AvailableOutAmount = new Decimal(this.AvailableOutAmount || 0)
        // 提币数量
        let quantity = new Decimal(this.quantity || 0)

        // 费用
        this.fee = fixFee
        // 若费率数量小于最低费率
        if (parseFloat(this.fee) < parseFloat(minFee)) {
          this.fee = minFee
        }
        this.fee = this.totalNum(this.fee, this.addCurrSource.Precision)
        // 可用数量 - 提币数量
        // let gap = AvailableOutAmount.sub(this.quantity).toFixed()

        // 若提币数量大于可用余额
        if (parseFloat(this.quantity) > parseFloat(this.AvailableOutAmount)) {
          this.realQuantity = ''
          return
        }

        // 若提币数量小于最低额
        if (parseFloat(this.quantity) < parseFloat(minQuantity)) {
          this.realQuantity = ''
          return
        }

        // 1.如果可用数量 > 最低提币数量 && 可用数量 < (提币数量 + 手续费)
        // 那么实际到账数量 = 可用数量 - 手续费
        // 2.可用数量 >= 提币数量+手续费
        let fee = this.fee.replace(/,/g, '')
        if (parseFloat(AvailableOutAmount.toFixed()) < parseFloat(quantity.add(fee).toFixed())) {
          // 传递给后台的参数看是传可用数量还是传递提币数量或者是传递实际到账数量
          this.realQuantity = AvailableOutAmount.sub(fee).toFixed()
          this.realQuantity = this.totalNum(this.realQuantity, this.addCurrSource.Precision)
        } else if (parseFloat(AvailableOutAmount.toFixed()) >= parseFloat(quantity.add(fee).toFixed())) {
          this.realQuantity = this.totalNum(quantity, this.addCurrSource.Precision)
        }
        // 如果quantity为空则相关参数也为空
        if (!this.quantity) {
          this.fee = ''
          this.realQuantity = ''
        }
      }
    },
    // 重要提示确定按钮
    icisee (e) {
      this.aicisee = false
      this.addCurrAlert = true
    },
    // 重要提示不在提示复选框
    dontremind (item) {
      localStorage.setItem('AssetsTopupHint', this.item.state)
    },
    iSfiatmoney (msg) {
      if (msg === true) {
        this.list = this.fiatmoney
      }
    },
    iSvirtualcurrency (msg) {
      if (msg === true) {
        this.list = this.virtualcurrency
      }
    },
    // 资产折合信息
    getlists () {
      let assetsType = this.$route.query.AssetsType || 2
      if (assetsType === '1') {
        this.fiatmoneyExplain = true
      } else {
        this.fiatmoneyExplain = false
      }
      this.$http.post('CustomerAssets/GetAssets', {
      }, {
        modalOptions: {
          modalClass: 'userModal'
        }
      })
      .then((res) => {
        if (res.isOk) {
          this.tota = res.Data || {}
          this.totalAmountList = res.Data.TotalAmountList || []
          this.currencyToteAssets = this.totalAmountList[0] || {}
          this.AssetsTag = this.list.AssetsTag
          this.list = res.Data.Assets.filter((item) => {
            return item.AssetsType === parseInt(assetsType)
          })
        }
      })
    },
    // 获取规则
    getKYCRule (KYCRule) {
      return this.$http.get('Setting/GetKYCRule', {
        kYCConstraint: KYCRule
      }, {
        isQueryString: true,
        isDisposeCode: false
      })
    },
    // 获取getCustomer用户信息
    getCustomer () {
      return this.$http.post('Security/GetCustomer', {
      }, {
        isDisposeCode: false
      })
    }
  },
  mounted () {
    this.getCustomer().then((res) => {
      this.customer = res || {}
    })
    this.exchangeCurrency()
    this.getlists()
    CheckCurrencyOnInput(this, this.$refs.rechargeAmount, 'rechargeAmount', 2)

    // 提币控制精度
    CheckCurrencyOnInput(this, this.$refs.quantity, 'quantity', () => {
      return this.inputPrecision
    })
  },
  beforeDestroy () {
    ModalApi.destroyAll(false)
  }
}
</script>
<style lang="less">
  @import './css/index.less';
  .subitmBox1111{
    color: white !important;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
  }
  button{
    color:white !important;
  }
  .banLayer {
    width: 400px;
    padding: 5px 0;
    p {
      padding: 20px 30px;
      font-size: 12px;
      color:#fff;
      text-align: center;
      a {
        color:#fff;
        font-size: 12px;
        font {
          color:#3782FF;
        }
      }
    }
  }
</style>
